<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			span {
				user-select: none;
				text-align: center;
				display: block;
				width: 50px;
				height: 24px;
				background-color: red;
			}
			#num2{
				
				display: block;
				width: 50px;
			}
		</style>
	</head>
	<body>
		<div>
			<table>
		 用户名：<input type="text" value=""/><br />
		密码： <input type="text" id="num1" value="请输入密码" /><br />
		 输入验证码： <input type="text" id="num2" value="" />
		 <span id="btn">验证码</span> 
		 <button id="btn2">登录</button>
		
		</table>
			</div>

		<script type="text/javascript">
			var n2 = num2.value;
			// var n1=btn1.value;
			btn.innerHTML = '' + randomNum(1000,9999);
			btn.onclick = function() {

				btn.innerHTML = '' + randomNum(1000,9999);


			}
				btn2.onclick = function() {
					if (num2.value != btn.innerHTML||num2.value==='') {
						

					alert('验证码错误')
						btn.innerHTML = '' + randomNum(1000,9999);
						num2.value='';
					} 
					
				}
					function randomNum(n, m) {

						//判断两个数的大小
						//获取两个数之间的随机数
						var max, min;
						max = n > m ? n : m;
						min = n < m ? n : m;
						return parseInt(Math.random() * (max - min + 1) + min);

					}
					console.log(randomNum(27, 20));
		</script>
	</body>
</html>
